<template>
	<view>
		<div class="centered-rectangle">
				<!-- 您可以在此区域内添加内容，例如文本、图片或链接 -->
				<div class="avatar-container">
				    <img src="/static/用户.png" alt="头像" class="avatar">
				</div>
				<div class="avatar-text">
					    <p>{{userName}}</p>
					    <div class="contact-info">
					        <span><img src="/static/手机.png"></span>
					        <span class="phone-number">{{phone}}</span>
					    </div>
				</div>
				<div class="centered-div">- 设置 -</div>
				<div class="icon-container">
				        <!-- 第一行 -->
				        <div class="icon-wrapper">
				            <div class="picture"><img src="/static/个人信息.png" class="wrapper"></div>
				            <div class="text">个人信息</div>
				        </div>
				        <div class="icon-wrapper" @click="headPaddword(userId)">
				            <div class="picture"><img src="/static/安全设置.png" class="wrapper"></div>
				            <div class="text">修改密码</div>
				        </div>
				        <div class="icon-wrapper">
				            <div class="picture"><img src="/static/信息.png" class="wrapper"></div>
				            <div class="text">关于我们</div>
				        </div>
				        <!-- 第二行 -->
				        <div class="icon-wrapper" @click="headSubaccount(userId)">
				            <div class="picture"><img src="/static/客户中心.png" class="wrapper"></div>
				            <div class="text">子账号</div>
				        </div>
				        <div class="icon-wrapper">
				            <div class="picture"><img src="/static/问题.png" class="wrapper"></div>
				            <div class="text">常见问题</div>
				        </div>
				        <div class="icon-wrapper">
				            <div class="picture"><img src="/static/反馈.png" class="wrapper"></div>
				            <div class="text">意见反馈</div>
				        </div>
				</div>
				<div class="wrapper-button">
					<button style="background-color: #fc8d04;color: #fff;" @click="acountModal(userId)">切换账号</button>
					<button @click="showInputModal(item, index)">退出账号</button>
				</div>
		</div>
		<Toast ref="toast" />
	</view>
</template>

<script>
	import Toast from '@/pages/components/loginOut/loginOut.vue';
	export default {
		components: {
		   Toast
		 },
		data() {
			return {
				userName:'',
				phone:'',
				userId:'',
				subaccount:'',
			}
		},
		onLoad(options) {
				 console.log(options.phone,options.userId)
				this.userName=options.userName;
				this.phone=options.phone;
				this.userId=options.userId;
				this.subaccount=options.subaccount;
				this.selectedOption=options.selectedOption
		},
		methods: {
			headSubaccount(userId){
				if(this.subaccount==='true'){
					uni.showToast({
					        title: '您没有权限，请联系管理员',
					        icon: 'none',
					    });
					return; 
				}
				 uni.navigateTo({
					url: '/pagesA/index/subaccount/subaccount?userId='+userId // 请注意，这里的url应为相对路径，且以'/'开头
				 });
			},
			headPaddword(userId){
				 uni.navigateTo({
					url: '/pages/index/edit/edit?userId='+userId // 请注意，这里的url应为相对路径，且以'/'开头
				 });
			},
			showInputModal(item, index) {
				console.log(this.userId)
				this.$refs.toast.show('是否退出登录');
				// this.item=item;
			 //      this.$refs.inputModal.showModal('预约', {
			 //        onConfirm: (value) => {
			 //          console.log('用户输入:', value);
			 //          // 在这里处理用户输入的内容
			 //        },
			 //        onCancel: () => {
			 //          console.log('用户取消了输入');
			 //        }
			 //      });
			     },
			acountModal(userId) {
				uni.navigateTo({
					url: '/pages/index/management/management?userId='+userId// 请注意，这里的url应为相对路径，且以'/'开头
				});
				}
		}
	}
</script>

<style>
@import "user.css";
</style>
